<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"  
                xmlns:h="http://java.sun.com/jsf/html">
    <p:blockUI block=":frmGestionarAcciones:grdAcciones" trigger=":frmGestionarAcciones:grdAcciones" widgetVar="blkPanelAccion" >
        Espere mientras se procesan los datos<br /> 
        <p:graphicImage value="/resource/images/loading.gif" style="width: 65px; height: 50px;"/>
    </p:blockUI>
    <h:form id="frmGestionarAcciones" onkeypress="if (event.keyCode == 13) return false;">
        <p:growl showSummary="false" showDetail="true" id="msjConfigAcciones"/>
        <p:panel id="panAcciones">
            <table style="width:100%;" >
                <thead>
                    <tr>
                        <td>
                            <table width="100%" cellpadding="5" cellspacing="8" style="width: 380px;">
                                <tr>
                                    <td style="width: 100px;"><h:outputText value="Opción :"/> </td>
                                    <td>
                                        <p:inputText value="#{opcionController.selectedOpcionNode.data.txtOpcion}" 
                                                     style="width: 300px; font-weight: bold;" disabled="true" styleClass="disabled">
                                        </p:inputText>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </thead>  
                <tbody>
                    <tr>
                        <td>
                            <p:menubar style="width: 99%;" id="menuOpciones">
                                <p:menuitem value="Nuevo" icon="ui-icon-person" process="@this" actionListener="#{opcionController.nuevaAccion}"
                                            update=":dlgDetalleAccion, :frmDetalleAccion, msjConfigAcciones">
                                </p:menuitem>
                                <p:menuitem value="Modificar" icon="ui-icon-pencil" process="@this, grdAcciones" actionListener="#{opcionController.loadAccion}" 
                                            update=":dlgDetalleAccion, :frmDetalleAccion, msjConfigAcciones">
                                </p:menuitem>
                                <p:menuitem value="Salir" icon="ui-icon-pencil" oncomplete="wGestionarAcciones.hide()"
                                            process="@this">
                                </p:menuitem>
                            </p:menubar>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <p:dataTable id="grdAcciones" var="item" scrollable="true"
                                         value="#{opcionController.lstAccion}" style="width: 1070px"
                                         rowKey="#{item.id}" scrollHeight="390"
                                         selection="#{opcionController.selectedAccion}" 
                                         selectionMode="single" paginator="false" 
                                         paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                         rowsPerPageTemplate="5,10,15,20"
                                         emptyMessage="No se encontraron acciones asociadas."
                                         rowIndexVar="index" editable="true"> 
                                <p:ajax event="rowEdit" listener="#{opcionController.onEdit}" update=":frmGestionarAcciones:msjConfigAcciones" 
                                        onstart="blkPanelAccion.show()" oncomplete="blkPanelAccion.hide()"/>  
                                <p:ajax event="rowEditCancel" listener="#{opcionController.onCancel}" update=":frmGestionarAcciones:msjConfigAcciones" />  
                                <p:column width="50" style="text-align: center; width: 50px" headerText="Id">
                                    <p:cellEditor>
                                        <f:facet name="output">
                                            <h:outputText value="#{item.id}" >
                                                <f:convertNumber pattern="00000" />
                                            </h:outputText>
                                        </f:facet>
                                        <f:facet name="input">
                                            <h:outputText value="#{item.id}" >
                                                <f:convertNumber pattern="00000" />
                                            </h:outputText>
                                        </f:facet>
                                    </p:cellEditor>
                                </p:column>
                                <p:column width="240" headerText="Acción" style="text-align: left; width: 240px" >
                                    <p:cellEditor>
                                        <f:facet name="output">
                                            <h:outputText value="#{item.txtAccion}" />
                                        </f:facet>
                                        <f:facet name="input">
                                            <p:inputText value="#{item.txtAccion}" style="width:100%"/>
                                        </f:facet>
                                    </p:cellEditor>
                                </p:column>
                                <p:column width="200" headerText="Nombre Objeto" style="text-align: left; width: 200px">
                                    <p:cellEditor>
                                        <f:facet name="output">
                                            <h:outputText value="#{item.txtNombreObjeto}" />
                                        </f:facet>
                                        <f:facet name="input">
                                            <p:inputText value="#{item.txtNombreObjeto}" style="width:100%"/>
                                        </f:facet>
                                    </p:cellEditor>
                                </p:column>
                                <p:column width="80" headerText="Estado" style="text-align: center; width: 80px">
                                    <p:cellEditor>
                                        <f:facet name="output">
                                            <h:outputText value="#{(item.flgActivo=='1')?'Activo':'Inactivo'}" />
                                        </f:facet>
                                        <f:facet name="input">
                                            <h:selectOneMenu value="#{item.flgActivo}" style="width: 90%;">
                                                <f:selectItem itemLabel="Activo" itemValue="1"/>
                                                <f:selectItem itemLabel="Inactivo" itemValue="0"/> 
                                            </h:selectOneMenu>
                                        </f:facet>
                                    </p:cellEditor>
                                </p:column>
                                <p:column width="200" headerText="Url" style="text-align: center; width: 200px">
                                    <p:cellEditor>
                                        <f:facet name="output">
                                            <h:outputText value="#{item.txtUrl}" />
                                        </f:facet>
                                        <f:facet name="input">
                                            <p:inputText value="#{item.txtUrl}" style="width:100%"/>
                                        </f:facet>
                                    </p:cellEditor>
                                </p:column>
                                <p:column style="width:6%">  
                                    <p:rowEditor rendered="#{item.flgDefault == '0'}"/>  
                                </p:column>
                            </p:dataTable>
                        </td>
                    </tr>
                </tbody>
            </table>
        </p:panel>
        <p:toolbar>
            <p:toolbarGroup align="right">
                <p:commandButton icon="ui-icon-close" value="Cerrar" process="@this" oncomplete="wGestionarAcciones.hide()"/>
            </p:toolbarGroup>
        </p:toolbar>
    </h:form>
</ui:composition>